<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/page/common/taglib.jsp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>商品首页</title>
	<meta name="description" content="" />
	<meta name="keywords" content="" />
	
    <script src="/js/jquery.min.js"></script>
	<script src="/js/jquery-migrate-1.4.1.min.js"></script>
	<script src="/js/jquery.easing.1.3.js"></script>
    <script src="/js/bootstrap.min.js"></script>
	<script src="/js/swiper.min.js"></script>
	<script src="/js/main.js"></script>
	
	
	<link href="/css/main/font-awesome.min.css" rel="stylesheet" type="text/css" >
    <link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/css/main/datepicker.css" rel="stylesheet" type="text/css">
    <link href="/css/main/style.css" rel="stylesheet">
	<link href="/css/user/reg.css" rel="stylesheet" type="text/css">
	<link href="/css/user/header.css" rel="stylesheet" type="text/css">
	
	<script>
		//移动端导航js
	   $('#aue-offcanvas .sub-menu > a').live("click", function() {
			var last = $('.sub-menu.open', $('#aue-offcanvas'));
			last.removeClass("open");
			var sub = $(this).next();
			if (sub.is(":visible")) {
				$(this).parent().removeClass("open");
				sub.slideUp(200);
			} else {
				$(this).parent().addClass("open");
				$(this).parent().parent().css('display', 'block!important');
				sub.slideDown(200);
			}
	   });
		
		
	   var flag = false;
	   
	  
		
	 //信息发送
		function validateAccount() {  
		    
			name = document.forms[0].username.value;
			
			if (name == null || name == "") {
				
				alert("会员名不能为空！");
				
				return;
			}
			
		    $.ajax({  
		    	
		        url:'/front/validateAccount',  
		        data:{'username':name},  
		        dataType:'JSON',  
		        type:'post',
		        success:function(data){  
		        	
		            if(data.result == '1'){  
		               
		               alert("当前账户名已经存在，请重新填写一个");
		               
		               flag = false;
		               
		               return;
		                
		            }else{  
		               
		            	flag = true;
		            	
		            	alert("当前账户名可以进行注册");
		            }  
		        },
		        
		        error:function (data) {
		         
		        	alert("result====="+JSON.stringify(data));
		        	
		        }
		    }); 
		      
		}	
		
		
		
	   function checkForm(){
		   
			var form = document.forms[0];
			
			if (!flag) {
				
				alert("当前账户名没有验证或者重复，请重新点击按钮认证或者重新输入一个新的用户名");
				
				return false;
			}
			
			if(form.username.value=="" || form.username.value.length<6){
				alert("请输入长度6位以上的用户名");
				return false;
			}
			
			if(form.password.value=="" || form.buyer.password.value.length<6){
				alert("请输入长度6位以上的密码");
				return false;
			}
			
			//邮件
			if(form.email.value=="" || form.email.value.indexOf("@") == -1){
				alert("有限不能为空或邮箱必须包含关键字");
				return false;
			}
			
			
			//手机号码
			
			if(form.phone.value=="" || form.phone.value.length<11){
				alert("手机不能为空且手机必须是11位");
				return false;
			}
			
			
			if(form.password.value!=form.repassword.value){
				alert("两次输入的密码不正确");
				return false;
			}
			
			if(/[\W]/g.test(form.username.value)){
				alert("用户名中不能含有中文");
				return false;
			};
			
			return true;
		}
	   
	</script>
	
	<script type="text/javascript"> 
	
		var countdown=60; 
		
		function sendSms(obj) { 
			
			phone = $("#phone").val();
			
			if (phone == null || phone == "") {
				
				alert("手机号码不能为空！");
				return;
				
			}
			
			if (countdown == 60) {
				
				sendMessage (phone);
			}
			
	    	
			if (countdown == 0) { 
		        
				obj.removeAttribute("disabled");    
		        
				obj.value="免费获取验证码"; 
		        
				countdown = 60; 
		        
				return;
		        
		    } else { 
		    	
		    	//发送短信
		        obj.setAttribute("disabled", true); 
		        
		        obj.value="重新发送(" + countdown + ")"; 
		        
		        countdown--; 
		    } 
			
			setTimeout(function() { 
				sendSms(obj) 
		    }
		    ,1000) 
		}
		
		//信息发送
		function sendMessage (phone) {  
		   
		    $.ajax({  
		    	
		        url:'/front/sendMessage',  
		        data:{'phone':phone},  
		        dataType:'JSON',  
		        type:'post',
		        success:function(data){  
		        	
		            if(data.result == '1'){  
		               
		                alert('短信发送成功');
		                
		            }else{  
		                console.log('短信发送失败！');  
		            }  
		        }  
		    }); 
		      
		}
		
		
 
</script>
	
   
  </head>
  <body>

<div id="aue-page">
		
<jsp:include page="/WEB-INF/page/common/Head.jsp"/>
		
<div id="Content">
<form action="/front/registerInfo" method="post" onsubmit="javascript:return checkForm()">

<INPUT TYPE="hidden" NAME="method" value="reg">
<input type="hidden" name="directUrl" value="">

<div id="Main">

  <ul id="FormRegStep1_Account" class="RegForm">
        
        <li class="Title">以下<span class="STYLE1">均为</span>必填项　</li>
		
		<li>
		   <div class="Hint">会员名：</div>
        <div class="Input">
		  	<input name="username" type="text" size="24" value="" tabindex="1"  maxLength="20" onkeyup="value=value.replace(/[\W]/g,'')"/> <br />
			<input type="button" id="check_username" name="check_username" value="检查会员名是否可用" onclick="validateAccount();"  onMouseOver="this.style.cursor='hand';"/>
  		  </div>
          <div class="Info">
        		<div id="username_info">5-20个字符(包括小写字母、数字、下划线)，一旦注册成功会员名不能修改。</div><br>
			    <div id="checkResult"></div><br>
          </div>
        <div class="HackBox"></div>
		</li>
 
	    <li>
            <div class="Hint">密码：</div>
            <div class="Input">
              <input name="password" value="" id="password" type="password" size="24" maxlength="16" tabindex="2"/>
            </div>
            <div class="Info">
            
                <div id="password_info">密码由6-16个字符组成，请使用英文字母加数字或符号的组合密码</div><br>
            
            </div>
            <div class="HackBox"></div>
          </li>
    
          <li>
            <div class="Hint">再输入一遍密码：</div>
            <div class="Input">
              <input name="repassword" value="" id="repassword" type="password" size="24" maxlength="16" tabindex="3"/>
            </div>
            <div class="Info">
            
                 <div id="confirm_password_info">请再输入一遍您上面输入的密码。</div><br>
            </div>
            <div class="HackBox"></div>
          </li>
		  <li>
            <div class="Hint">电子邮件：</div>
            <div class="Input">
              <input name="email" value="" id="email" type="text" size="28" maxlength="45" tabindex="3"/>
            </div>
            <div class="Info"><div id="email_info"></div>
            </div>
            <div class="HackBox"></div>
          </li>
          
          <li>
            <div class="Hint">手机号：</div>
            <div class="Input">
              <input name="phone" value="" id="phone" type="text" size="28" maxlength="45" tabindex="3"/>
            </div>
            <div class="Info"><div id="phone_info"></div>
            </div>
            <div class="HackBox"></div>
          </li>
          
          <li>
            <div class="Hint">短信验证码：</div>
            <div class="Input">
              <input name="smscode" value="" id="smscode" type="text" size="28" maxlength="45" tabindex="3"/>
            </div>
            <div class="Info">
               <div id="smscode_info"><input type="button" value="发送短信验证码" onclick="sendSms(this);"></div>
            </div>
            <div class="HackBox"></div>
          </li>
          
	</ul><p class="SubmitBox">
	<input type="submit" name="Submit" value="提交注册信息" tabindex="8" />
	</p></div>
   </form>
  </div>
		
		<!-- 尾部 -->
	<jsp:include page="/WEB-INF/page/common/Foot.jsp"/>
</div>


  </body>
</html>